<template>
    <div style='position: fixed;z-index: 1000;top:0;left:0; width:100%;height:100vh;background: rgba(0,0,0,.5);padding:100px 50px;overflow: scroll;'>
        <img @click="returnFull" style="position: absolute;top: 40px;left: 100%;margin-left: -50px;" src="../../../assets/close_icon.svg">
        <div style="background: #fff;width:100%;min-height:500px;padding:30px 20px;">
          <a-table
            ref="table"
            size="middle"
            bordered
            :columns="columns"
            :dataSource="dataSource"
            :pagination="ipagination"
            @change="handleTableChange">
            <template slot="imgSlot" slot-scope="text">
              <span v-if="!text" style="font-size: 12px;font-style: italic;">无此图片</span>
              <div v-else @click="jumpProview(text)">
                <img :src="text" height="25px" alt="图片不存在" style="max-width:80px;font-size: 12px;font-style: italic;"/>
              </div>
            </template>
          </a-table>
        </div>
    <JProviewImg v-if="showImg" @closeProview="closeProview" :imgurl="proviewUrl"></JProviewImg>
    </div>
  </template>
  <script>
    import { mixinDevice } from '@/utils/mixin.js'
    import PageLayout from '@/components/page/PageLayout'
    import { initDictOptions, filterMultiDictText } from '@/components/dict/JDictSelectUtil'
    // import { JeecgListMixin } from '@/mixins/JeecgListMixin'
    import { postAction,getAction } from '@/api/manage'
    import JProviewImg from '@/components/jeecg/JProviewImg.vue'
  
    export default {
      name: "BlockProductStandardsAllCheck",
      components: {
        PageLayout,
        JProviewImg
      },
      props:['listCheckData'],
      // mixins: [JeecgListMixin],
      data () {
        return {
        showImg:false,
        proviewUrl:"",
        dataSource:[],
        ipagination: {
          current: 1,
          pageSize: 10,
          showTotal: (total, range) => {
            return range[0] + '-' + range[1] + ' 共' + total + '条'
          },
          showQuickJumper: true,
          showSizeChanger: true,
          total: 0
        },
          // 表头
          columns: [
            {
              title: '店家名',
              align:"center",
              dataIndex: 'name'
            },
              {
              title: '店家手机号',
              align:"center",
              dataIndex: 'cellPhoneNumber'
            },
            {
              title: '店家地址',
              align:"center",
              dataIndex: 'address'
            },
            {
              title: '店家头像',
              align:"center",
              dataIndex: 'headPortrait',
              scopedSlots: { customRender: 'imgSlot' }
            } 
          ],
        }
      },
      filters: {
        statusFilter(status) {
          const statusMap = {
            'agree': '成功',
            'reject': '驳回'
          }
          return statusMap[status]
        },
        statusTypeFilter(type) {
          const statusTypeMap = {
            'agree': 'success',
            'reject': 'error'
          }
          return statusTypeMap[type]
        }
      },
      mounted() {
        this.ipagination.total = this.listCheckData.total;
        this.dataSource = this.listCheckData.list;
        console.log(this.listCheckData);
      },
      methods: {
        handleTableChange(pagination, filters, sorter){
          this.ipagination = pagination;
          getAction("https://blockinsight.com.cn/blackExplorationExhibition/third/getRegistUser?scriptEncoding="+this.listCheckData.id+"&currentPage="+this.ipagination.current+"&pageSize=10")
          .then(res => {
            if (res.success) {
              this.ipagination.total = res.data.totalUser;
              this.dataSource = res.data.users;
            } else {
              that.$message.warning(res.message)
            }
          })
        },
        returnFull(){
            this.$emit('returnUp',false)
        },
        closeProview(){
          this.showImg = false;
        },
        jumpProview(val){
          this.showImg = true;
          this.proviewUrl = val;
        },
      },
    }
  </script>
  
  <style lang="scss" scoped>
    .titleSty{
      font-size: 18px;
      font-weight: bold;
      margin: 30px 0 10px 0;
    }
    ul{
      list-style-type:none;
    }
    .detail-layout {
      /* margin-left: 44px; */
    }
    .text {
      color: rgba(0, 0, 0, .45);
    }
  
    .heading {
      color: rgba(0, 0, 0, .85);
      font-size: 20px;
    }
  
    .no-data {
      color: rgba(0, 0, 0, .25);
      text-align: center;
      line-height: 64px;
      font-size: 16px;
  
      i {
        font-size: 24px;
        margin-right: 16px;
        position: relative;
        top: 3px;
      }
    }
  
    .mobile {
      .detail-layout {
        margin-left: unset;
      }
      .text {
  
      }
      .status-list {
        text-align: left;
      }
    }
  </style>